<template>
  <div class="homework-detail-container">

    <div class="homework-detail-subtitle">
      奖项详情:
    </div>
    <el-table
      :data="awardItemList"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
    >
      <el-table-column align="center" label="奖项编号" width="95">
        <template slot-scope="scope">
          {{ scope.row.id }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="奖项备注">
        <template slot-scope="scope">
          {{ scope.row.name }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="授权单位">
        <template slot-scope="scope">
          <span>{{ scope.row.organizationId }}</span>
        </template>
      </el-table-column>
      <el-table-column class-name="status-col" label="申请人" width="200" align="center">
        <template slot-scope="scope">
          <span>{{ username }}</span>
        </template>
      </el-table-column>
    </el-table>

    <div class="homework-detail-subtitle" :style="{marginBottom: '20px'}">
      提交材料:
    </div>
    <div class="transfer-container">
      <el-transfer v-model="value" :data="myAwardList"></el-transfer>
    </div>
    <div class="submit-container">
      <el-button type="success" @click="submit">确认提交</el-button>
    </div>

  </div>
</template>

<script>
  import {
    deleteOneHomeworkAttachfile,
    getHomeworkAttachFileListByHid,
    getOneHomework, queryOneAward, updateOneHomework,
    uploadHomeworkAttachFile, uploadHomeworkSubmitFile,
  } from "../../api";
  import {HOST, organizationMap, ROLE_KEY, UID_KEY, UNAME_KEY} from "../../constants";
  import {submitApplication} from "../../api/student";

export default {
  name: 'HomeworkDetail',
  // data() {
  //   return {
  //     role: null,
  //     host: HOST,
  //     list: [1,2,3,4],
  //     value: [5,6,7,8]
  //   }
  // },
  data() {
    return {
      myAwardList: [{
        key: 10001,
        label: "校一等奖学金"
      }],
      username: localStorage.getItem(UNAME_KEY),
      value: [10001],
      awardItemList: []
    };
  },
  methods: {
    submit() {
      let formData = new FormData();
      formData.append("awardId", this.$route.params.id)
      formData.append("applicationPaperIdList", this.value)
      submitApplication(formData).then(res => {
        console.log(res)
      })
    }
  },
  mounted() {
    this.role = localStorage.getItem(ROLE_KEY)
    console.log(this.$route.params.id)
    queryOneAward(this.$route.params.id).then(res => {
      let data = res.data
      data.organizationId = organizationMap[data.organizationId.toString()]
      this.awardItemList.push(data)
    })
  }
}
</script>

<style lang="scss" scoped>
.submit-container {
  margin-top: 20px;
}
.homework-detail {
  &-container {
    margin: 30px;
  }
  &-title {
    font-size: 30px;
    line-height: 46px;
  }
  &-text {
    margin-top: 15px;
    font-weight: 400;
    font-size: 16px;
  }
  &-subtitle {
    font-size: 24px;
    margin-top: 25px;
    margin-bottom: 20px;
  }
  &-attachfile-list {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
  }
  &-attachfile-item {
    display: flex;
    margin-bottom: 10px;
    margin-right: 15px;
  }
}
.edit-btn {
}
</style>
